<template>
    <el-dialog :model-value="props.visible" title="用纸需求单" center width="38%" @close="handleClose">
        <el-form ref="formRef" :model="formData">
            <el-row :gutter="20">
                <el-col :span="10">
                    <el-form-item label="纸张类型">{{ props.paperInfo?.paperName }}</el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="纸张详情">{{ `${props.paperInfo?.weight}g * ${props.paperInfo?.length}mm *
                        ${props.paperInfo?.width}mm` }}</el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="10">
                    <el-form-item label="用纸渠道" prop="useMethod">
                        <el-select v-model="formData.useMethod">
                            <el-option value="1" label="对外采购"></el-option>
                            <el-option value="2" label="外协仓库"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="需求数量">{{ props.paperInfo?.produceNumber }}</el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="公司信息" prop="companyId">
                        <el-select v-model="formData.companyId" :disabled="!isDisabled">
                            <el-option v-for="item in subsidiariesList" :key="item.id" :label="item.companyName"
                                :value="item.id" />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="10">
                    <el-form-item label="库存用纸" prop="paperType">
                        <el-select v-model="selectedPaper" value-key="id" :disabled="isDisabled" placeholder="请选择">
                            <el-option v-for="item in paperList" :key="item.id"
                                :label="`${item.productSubcategoryName + ' ' + item.specsDetail}`"
                                :value="item"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="现有库存：" prop="useMethod">
                        {{ `${selectedPaper?.currentInventory || 0}` }}
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="10">
                    <el-form-item :label="formData.useMethod == '1' ? '用纸数量' : '调纸数量'" prop="useNumber">
                        <el-input type="number" v-model.number="formData.useNumber" placeholder="请输入"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="生产数量" prop="produceNumber">
                        {{ formData.useNumber && Number(props.purchasePaperObj?.numberOfSets) *
                            Number(formData.useNumber) }}
                        <!-- <el-input type="number" v-model.number="formData.produceNumber" placeholder="请输入"></el-input> -->
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
            <el-button type="primary" @click="handleSubmit">确 定</el-button>
            <el-button @click="handleClose">取 消</el-button>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
import { type FormInstance } from 'element-plus';
import { getAuxiliaryByTypeApi, getAllSubsidiaryApi } from '@/api/sj/warehouse/auxiliary';
import { addSemiProductOrderApi, addPaperPurchaseOrderApi } from '@/api/sj/productManagement/semiProductOrder/index';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;


const formRef = ref<FormInstance>();

const props = defineProps<{
    visible: boolean;
    paperInfo: any;
    paperType: any[];
    purchasePaperObj: any;
}>();
const emits = defineEmits(['close', 'submit']);
//纸张类型大类(外协库);
const majorCatagoryType = 'auxiliary_material_assist';

const isDisabled = ref(true);

const formData = ref({
    useMethod: '1',
    paperType: undefined,
    produceNumber: undefined,
    useNumber: undefined,
    companyId: undefined,
});


const paperList = ref<any[]>([]);
const selectedPaper = ref<any>();
const subsidiariesList = ref<any>([]);



watch(() => props.paperInfo, async (newData) => {
    const { data } = await getAuxiliaryByTypeApi(majorCatagoryType, newData.paperType);
    paperList.value = data;
}, { deep: true });

watch(() => formData.value, (newData) => {
    console.log(newData)
    if (newData.useMethod == '1') {
        isDisabled.value = true;
    } else {
        isDisabled.value = false;
    };
    console.log(isDisabled.value);
}, { deep: true });

const handleClose = () => {
    formRef.value?.resetFields();
    selectedPaper.value = undefined;
    emits('close');
};

/** 提交 */
const handleSubmit = async () => {

    if (formData.value.useMethod == '1') {
        const query = {
            semiProductionId: props.purchasePaperObj?.id,
            semiId: props.purchasePaperObj?.semiId,
            applyPurchaseNumber: formData.value.useNumber,
            specifications: `${props.paperInfo?.weight}g*${props.paperInfo?.length}mm*${props.paperInfo?.width}mm`,
            paperType: props.paperInfo?.paperType,
            companyId: formData.value.companyId
        }

        try {
            const { code } = await addPaperPurchaseOrderApi(query);

            if (code == 200) {
                proxy?.$modal.msgSuccess('操作成功');
                emits('submit');
                handleClose();
            }
        } catch (error) {
            console.log(error);
        }
    }
    if (formData.value.useMethod == '2') {

        if (props.paperInfo?.produceNumber > formData.value && formData.value.produceNumber) {
            proxy?.$modal.msgError('需求数量不能大于现有库存');
            return;
        }

        const query = {
            subclassName: props.paperInfo?.paperName,
            semiProductId: props.purchasePaperObj?.id,
            materialDetail: `${props.paperInfo?.weight}g*${props.paperInfo?.length}mm*${props.paperInfo?.width}mm`,
            allocationNumber: Number(props.purchasePaperObj?.numberOfSets) * Number(formData.value.useNumber),
            auxiliaryId: selectedPaper.value.id,
            inventorySubclassName: props.paperInfo?.paperName,
            inventoryMaterialDetail: selectedPaper.value.specsDetail,
            useNumber: formData.value.produceNumber,
        }

        try {
            const { code } = await addSemiProductOrderApi(query);

            if (code == 200) {
                proxy?.$modal.msgSuccess('操作成功');
                emits('submit');
                handleClose();
            }
        } catch (error) {

        }


    }
};

/** 获取所有子公司 */
const getCompanyList = async () => {
    const { data } = await getAllSubsidiaryApi();
    subsidiariesList.value = data;
};

onMounted(() => {
    getCompanyList();
});
</script>

<style scoped></style>